<template>
  <div>
      <el-button type="success" @click="add">添加</el-button>
      <v-dialog :info="info" ref="add"></v-dialog>
      <v-list @edit="edit"></v-list>
  </div>
</template>

<script>
import vDialog from './components/Dialog'
import vList from './components/List'
export default {
    data(){
        return{
            info:{
                isShow:false,//控制dialog的显示与隐藏
                title:'',//dialog的标题
                isAdd:true,//是否是添加
            }
        }
    },
    methods:{
        // 作用:控制dialog的显示与隐藏
        add(){
            this.info.isShow = true;
            this.info.title = '添加菜单';
            this.info.isAdd = true;
        },
        // 作用:控制dialog的显示与隐藏
        edit(id){
            this.info.isShow = true;
            this.info.title = '编辑菜单';
            this.info.isAdd = false;
            this.$refs.add.getDetail(id)
        }
    },
    components:{
        vDialog,
        vList
    },
    mounted(){
        // 设置路由元信息
        document.title = this.$route.meta.title
    }
}
</script>

<style scoped>

</style>